<template>
  <a-modal
    title="物料投料"
    :width="1000"
    :visible="visible"
    :confirmLoading="confirmLoading"
    :maskClosable="false"
    @ok="handleOk"
    @cancel="handleCancel"
  >
    <a-spin :spinning="confirmLoading">
      <a-row>
        <a-form layout='horizontal'>
          <a-form-item
            label='投料条码'
            :labelCol=' { span: 4 }'
            :wrapperCol='{ span: 18 }'
          >
            <a-input @pressEnter='handleBarCode' ref='barcodeInput' v-model='barCode'></a-input>
          </a-form-item>
        </a-form>
      </a-row>
      <a-row type="flex" justify="center">
        <a-col :span='18' >
          <a-descriptions :column='2' style='margin: auto'>
            <a-descriptions-item label="物料编码">
              {{result.matCode}}
            </a-descriptions-item>
            <a-descriptions-item label="物料名称">
              {{result.matName}}
            </a-descriptions-item>
            <a-descriptions-item label="供应商">
              {{result.supplier}}
            </a-descriptions-item>
            <a-descriptions-item label="投料数量">
              <a-input v-model='number'></a-input>
            </a-descriptions-item>
          </a-descriptions>
        </a-col>

      </a-row>
    </a-spin>
  </a-modal>
</template>

<script>
import { analyzeBarcode } from '@/api/base/material'
import { feeting } from '@/api/plan/workcenterplan'
export default {
  name: 'devoteMaterail',
  data() {
    return {
      visible: false,
      confirmLoading: false,
      number: '',
      result: {
        matCode: '',
        matName: '',
        supplier: ''
      },
      planCode: '',
      workCenterCode: '',
      barCode: ''

    }
  },
  methods:{
    init(planCode,workCenterCode){
      this.planCode = planCode
      this.workCenterCode = workCenterCode
      this.visible = true
      this.number = 0
      this.result = {
        matCode: '',
        matName: '',
        supplier: ''
      }
      this.barCode = ''
    },
    handleBarCode(e){
      console.log(e.target.value,'value')
      this.confirmLoading = true
      analyzeBarcode(e.target.value).then(res => {
        this.result = Object.assign({},this.result,res.data)
        this.number = res.data.num
      }).catch(err => {
        this.$message.error(err.msg)
      }).finally(() => {
        this.confirmLoading = false
      })

    },
    handleOk(){
      this.confirmLoading = true
      feeting({
        matBarcode: this.barCode,
        planCode: this.planCode,
        workCenterCode: this.workCenterCode,
        number: this.number
      }).then(res => {
        this.$message.success("投料成功")
      }).catch(err => {
        this.$message.error(err.msg)
      }).finally(() => {
        this.confirmLoading = false
      })
    },
    handleCancel(){
      this.visible = false

    }



  }
}
</script>

<style scoped>

</style>